<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();

	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path;
%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="copyright" content="" />
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		
		<title>全员营销活动类型列表页</title>
		
		<link href="<%=path%>/favicon.ico" rel="shortcut icon">
		<link href="https://cdn.jsdelivr.net/gh/bootcdn/BootCDN/ajax/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/public.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/activity.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/custom.css" />
		<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/style_list.css" />  
		<link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/marketing.css" />
	
		<link href="<%=path%>/hplus/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
		<link href="<%=path%>/hplus/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
		<link href="<%=path%>/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
		<link href="<%=path%>/hplus/css/plugins/footable/footable.core.css" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/css/plugins/dataTables/css/jquery.dataTables.min.css" />
		<link href="<%=path%>/hplus/css/animate.min.css" rel="stylesheet">
		<link href="<%=path%>/hplus/css/style.min862f.css?v=4.1.0" rel="stylesheet">
		<link href="<%=path%>/hplus/css/plugins/clockpicker/clockpicker.css" rel="stylesheet">
		<link href="<%=path%>/hplus/css/plugins/datapicker/datepicker3.css" rel="stylesheet">
		<link rel="stylesheet" type="text/css" href="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.css">
		
		<style type="text/css">
			.div-serch{
				margin-left:20px;
			}
			.x_selectuser .issue_selectuser {
				padding: 0px;
			}
			.x_selectuser .issue_selectuser  .header {
				padding: 18px;
				background: #F2F3F3;
				display: flex;
				justify-content: space-between;
			}
			.x_selectuser .issue_selectuser  h2{
				margin: 0px;
			}
		</style>
	</head>
	<body>
		<div class="wrapper wrapper-content animated fadeInRight">
			<div class="container-fluid">
				<div class="row" style="background-color:white; padding-left:15px ">
					<a onclick="aemType.backToAemInfoPage()" style="color:black">全员营销活动</a> <span>></span> <span style="color:#1BB394">活动类型管理</span> 
				</div>
				<!-- 功能按钮 -->
				<div class="row" style="background-color: white; float: right; padding-right:15px">
					<shiro:hasPermission name="type_manage:create">
						<span><button id="create-aem" type="button" class="btn btn-primary" onclick="aemType.addDialog()">创建活动类型</button></span> 
					</shiro:hasPermission>
				</div>
				
				<div class="row">
					<div class="col-sm-12 " style="margin-top: 20px;">
						<div class="ibox float-e-margins white-bg">
							<div class="table-responsive">
								<table class="display  table-striped table-bordered " id="page-list-table">
									<thead>
										<tr>
											<th>活动类型</th>
											<th>活动数量</th>
											<th>操作</th>
										</tr>
									</thead>
									<tbody style="font-size: 15px"></tbody>
								</table>
							</div>
						</div>
					</div>
				</div>    <!-- row end -->
	
			</div>
		</div>
		
		
		<div id="add-dialog" class="row m-b-lg x_selectuser">
		    <div class="col-sm-12 issue_selectuser " style="border-top: 0px solid;height: 250px; display:block; width:500px; padding-top:0px; left:35%; top:25%">
		    	<div class="header" style="text-align: left; ">
		        	<h2 >创建活动类型</h2>
		        	<img src="<%=path%>/images/companycard/delete.png" width="25px" height="25px" onclick="aemType.closeDialog()">
		        </div> 
		        <div class="row" style="margin-top:20px">
		        	活动类型名称
	                <input id="add-name" placeholder="请输入活动类型名称" class="form-control" style="width: 300px;display: inline-block;" maxlength="8">
		        </div> 
		        <div class="col-sm-12 text-center" style="margin-top:50px;">
		            <button class="btn btn-w-m btn-white" type="button"  onclick="aemType.closeDialog()">取消</button>
	            	&nbsp;&nbsp;&nbsp;&nbsp;
		            <button class="btn btn-w-m btn-primary" type="button" onclick="aemType.addSubmit(this)">确认</button>
		        </div>
		    </div>
		</div>
		
		
		<div id="edit-dialog" class="row m-b-lg x_selectuser">
		    <div class="col-sm-12 issue_selectuser " style="border-top: 0px solid;height: 250px; display:block; width:500px; padding-top:0px; left:35%; top:25%">
		    	<div class="header" style="text-align: left; ">
		        	<h2 >编辑活动类型</h2>
		        	<img src="<%=path%>/images/companycard/delete.png" width="25px" height="25px"  onclick="aemType.closeDialog()">
		        </div> 
		        <div class="row" style="margin-top:20px">
		        	活动类型名称
	                <input id="edit-name" placeholder="请输入活动类型名称" class="form-control" style="width: 300px;display: inline-block;" maxlength="8">
		        	<input id="edit-id" type="hidden" value="">
		        	<input id="old-name" type="hidden" value="">
		        </div> 
		        <div class="col-sm-12 text-center" style="margin-top:50px;">
		            <button class="btn btn-w-m btn-white" type="button" onclick="aemType.closeDialog()">取消</button>
		            &nbsp;&nbsp;&nbsp;&nbsp;
		            <button id="edit-btn" class="btn btn-w-m btn-primary" type="button" attr-id="" onclick="aemType.editSubmit(this)">确认</button>
		        </div>
		    </div>
		</div>
		
	</body>
</html>


<script src="<%=path%>/hplus/js/jquery.min.js?v=2.1.4"></script>
<script type="text/javascript" src="<%=path%>/hplus/js/plugins/dataTables/jquery.dataTables.min.js"></script>

<script src="<%=path%>/hplus/js/bootstrap.min.js?v=3.3.6"></script>
<script src="<%=path%>/hplus/js/plugins/chosen/chosen.jquery.js"></script>
<script src="<%=path%>/hplus/js/plugins/jsKnob/jquery.knob.js"></script>
<script src="<%=path%>/hplus/js/plugins/jasny/jasny-bootstrap.min.js"></script>
<script src="<%=path%>/hplus/js/plugins/datapicker/bootstrap-datepicker.js"></script>
<script src="<%=path%>/hplus/js/plugins/prettyfile/bootstrap-prettyfile.js"></script>
<script src="<%=path%>/hplus/js/plugins/switchery/switchery.js"></script>
<script src="<%=path%>/hplus/js/plugins/ionRangeSlider/ion.rangeSlider.min.js"></script>
<script src="<%=path%>/hplus/js/plugins/iCheck/icheck.min.js"></script>
<script src="<%=path%>/hplus/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="<%=path%>/hplus/js/plugins/colorpicker/bootstrap-colorpicker.min.js"></script>
<script src="<%=path%>/hplus/js/plugins/clockpicker/clockpicker.js"></script>
<script src="<%=path%>/hplus/js/plugins/cropper/cropper.min.js"></script>
<script src="<%=path%>/hplus/js/demo/form-advanced-demo.min.js"></script>
<script src="<%=path%>/hplus/js/plugins/suggest/bootstrap-suggest.min.js"></script>
<script src="<%=path%>/hplus/js/plugins/sweetalert/sweetalert2.min.js"></script>
<script type="text/javascript" src="<%=path%>/js/marketing/dialog.js"></script>
<script type="text/javascript" src="<%=path%>/js/marketing/public.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>

<!-- 全员营销活动类型 - 主脚本 -->
<%-- <script type="text/javascript" src="<%=path%>/js/aem/aem-type.js"></script>  --%>


<script type="text/javascript">
	$(function(){
		aemType.init("<%=path%>").dataTable();      
	});
</script>





<!-- 		弹窗模板

	issue_selectuser样式属性需要重置以便调整弹窗位置： style="height: 200px; display:block; width:500px; padding-top:0px; left:35%; top:25%" 

<div id="selectuser" class="row m-b-lg x_selectuser">
   	<div class="col-sm-12 issue_selectuser " style="height: 666px; display:block">
       	<div class="row">
       		TODO
       	</div>
       	<div class="m_xpages" style="    padding: 0;">
           	<div class="mian">
           		TODO
           	</div>
       	</div>
       	<div class="col-sm-12 text-center" style="margin-top:10px;">
           	<button class="btn btn-w-m btn-primary" type="button">确认</button>&nbsp;&nbsp;&nbsp;&nbsp;
           	<button class="btn btn-w-m btn-white" type="button"  onclick="aemType.closeDialog()">取消</button>
        </div>
    </div>
</div>

-->


<script type="text/javascript">
/**
 * @description: 全员营销活动列表页
 *
 * @author Yangcl
 * @date 2018年6月22日 上午10:35:27
 * @version 1.0.0.1
 */
var aemType = {
		myDataTable : null,  
		path : "",        // 绝对路径
		
		// 搜索条件|需求暂时未涉及到，此处保留
		name : "", 
		
		init:function(path_ ){
			aemType.path = path_; 
			return aemType;
		},
		
		dataTable : function(){
			aemType.myDataTable = $('#page-list-table').DataTable({
				columns: [
	         		{"data":"name"},		// 活动类型名称
	         		{"data":"typeCount"},	// 活动数量
	         		{"data":"id"}, 	 // 操作   
	         	],
	         	
	         	ajax:{
	     	    	contentType: 'application/json;charset=utf-8',
	     	    	type: 'POST',
	     	    	url: aemType.path + "/aemInfo/ajaxAemTypePageList",
	     	    	data: function(e){
	     	    		e.name = aemType.name; 
	     				return JSON.stringify(e); 
	     			}
	     		},
	         	
	     		processing: true,
	     		ordering: false,
	     		searching: false,
	     		info: true,
	     		autoWidth: true,
	     		lengthChange: false,
	     		"order": [[ 2, "desc" ]],
	     	    language: {
	     	    	emptyTable: '没有数据',
	     	    	info: '从第 _START_ 到第 _END_ 条数据；总共有 _TOTAL_ 条记录',
	     			infoEmpty: '没有数据',
	     			lengthMenu: '每页显示 _MENU_ 条记录',
	     			loadingRecords: '正在加载数据....',
	     			processing: '正在处理数据....',
	     			zeroRecords: '没有找到匹配的记录',
	     			paginate: {
	     				first: '首页',
	     				previous: '前页',
	     				next: '后页',
	     				last: '尾页'
	     			}
	     	    },
	     	    order: [[1,'desc']],
	     		pageLength: 10,
	     	    pagingType: 'full_numbers',
	     	    columnDefs: [
	     	    	{
		     			render: function(data, type, e) {
		     				var result = '';
		     				<shiro:hasPermission name="type_manage:edit">
			     				result += '<a href="javascript:void(0);" attr="' + e.id + '" onclick="aemType.editDialog(this)"><font color="#1ab394">编辑</font></a> ' 
			                    result += '&nbsp&nbsp&nbsp&nbsp' 
							</shiro:hasPermission>
							
							<shiro:hasPermission name="type_manage:delete">
								result += '<a href="javascript:void(0);" attr="' + e.id + '" onclick="aemType.deletedDilog(this)"><font color="#1ab394">删除</font></a>';
							</shiro:hasPermission>
							
		     				return result;
		                 },
		     			targets: 2
	     	    	}
     	    	],
	     	    serverSide: true,
	     	    "initComplete": function(settings, json) {
	     	    	
	     	    }
	     	});
			
			return aemType.myDataTable; 
		},
		
		// 搜索
		search : function(){
			// aemType.name = $("#aem-type-name").val(); 
			aemType.myDataTable.ajax.reload(function(){});
		},
		
		// 打开添加弹窗
		addDialog : function(){
			$("#add-name").val("");
			$("#add-dialog").show();
		},
		
		// 打开编辑弹窗 
		editDialog : function(o){
			$("#edit-id").val("");
			$("#edit-name").val("");
			$("#old-name").val("");
			
			var td = $(o).parent().parent().children()[0];
			$("#edit-id").val($(o).attr("attr"));
			$("#edit-name").val(td.innerHTML);
			$("#old-name").val(td.innerHTML)
			$("#edit-dialog").show();
		},
		
		// 关闭弹窗
		closeDialog : function(){
			$(".x_selectuser").hide();
		},
		
		addSubmit : function(o){
			var url = aemType.path + "/aemInfo/ajaxAddAemType"; 
			var data = {
					name : $("#add-name").val()
			};
			var e = JSON.parse(aemType.syncAjax("post", url , data , false)); 
			if(e.status == "200"){
				aemType.search();
				aemType.closeDialog();
			}else{
				aemType.pageMessage("添加失败" , e.message);
			}
		},
		
		editSubmit : function(o){
			var url = aemType.path + "/aemInfo/ajaxUpdateAemType"; 
			var data = {
					id : $("#edit-id").val(),
					name : $("#edit-name").val(),
					oldName : $("#old-name").val()
			};
			var e = JSON.parse(aemType.syncAjax("post", url , data , false)); 
			if(e.status == "200"){
				aemType.search();
				aemType.closeDialog();
			}else{
				aemType.pageMessage("更新失败" , e.message);
			}
		},
		
		deletedDilog : function(o) {
			swal({
				  title: '您确定要删除此活动吗?',
				  text: "删除后将无法恢复，请谨慎操作！",
				  type: 'warning',
				  showCancelButton: true,
				  confirmButtonColor: '#d33',
				  cancelButtonColor: '#3085d6',
				  confirmButtonText: '删除',
				  cancelButtonText:'取消'
				}).then(function () {
					aemType.deleteAemType($(o).attr("attr"));
				})
		},
		
		deleteAemType : function(id_){
			var url = aemType.path + "/aemInfo/ajaxDeleteAemType"; 
			var data = {
					id : id_
			};
			var e = JSON.parse(aemType.syncAjax("post", url , data , false)); 
			if(e.status == "200"){
				aemType.search();
				aemType.closeDialog();
			}else{
				aemType.pageMessage("删除失败" , e.message);
			}
		},
		
		// 返回列表页
		backToAemInfoPage : function(){
			window.location.href = aemType.path + "/view/ui/aemInfoPage";   
		},
		
		
		// 消息提示对话框
		pageMessage : function(title_ , msg_){
			swal({
				  title: title_,
				  text: msg_,
				  type: 'warning',
				  showCancelButton: false,
				  confirmButtonColor: '#d33',
				  confirmButtonText: '确定' 
				})
		},
		
		
		/**
		 * 发送ajax请求
		 * 
		 * type_ : post or get
		 * url_ : url 
		 * data_ : data_
		 * async_ : sync type ,true or false
		 */
		syncAjax : function(type_, url_, data_  , async_) {
			var msg_ = null;
			$.ajax({
					dataType : "text",
					type : type_,
					url : url_,
					data : data_,
					async : async_, 
					success : function(msg) {
							msg_ = msg;
					},
					error : function(msg) {
							msg_ = msg;
					}
			});
			return msg_;
		}
}


</script>



















